<!DOCTYPE html>
<html lang="zxx">
<head>
	<title>Gallery</title>
	<!-- for-mobile-apps -->
	<meta name="viewport" content="width=device-width, initial-scale=1">
	<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
	<meta name="keywords" content="" />
	<script type="application/x-javascript">
		addEventListener("load", function () {
			setTimeout(hideURLbar, 0);
		}, false);

		function hideURLbar() {
			window.scrollTo(0, 1);
		}
	</script>
	<!-- //for-mobile-apps -->
	<link href="css/bootstrap.css" rel="stylesheet" type="text/css" media="all" />
	<link href="css/style.css" rel="stylesheet" type="text/css" media="all" />
	<link href="css/font-awesome.css" rel="stylesheet">
	<link rel="stylesheet" type="text/css" href="css/gallery.css" />

	<!-- css files -->
	<link href="http://fonts.googleapis.com/css?family=Josefin+Sans:100,100i,300,300i,400,400i,600,600i,700,700i&amp;subset=latin-ext" rel="stylesheet">
	<link href="http://fonts.googleapis.com/css?family=Roboto" rel="stylesheet">
	<!-- //css files -->
</head>

<body>
	<!-- banner -->
	<div class="banner-main">
		<div class="banner-2">
			
			<!--header-->
			<div class="header">
				<div class="container">
					<nav class="navbar navbar-default">
						<div class="navbar-header">
							<button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
							<span class="sr-only">Toggle navigation</span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
							<span class="icon-bar"></span>
						</button>
							<h1><a href="index.html">Improve</a></h1>
						</div>
						<!--navbar-header-->
						<div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
							<ul class="nav navbar-nav navbar-right">
								<li><a href="index.html">Home</a></li>
								<li><a href="about.html">About</a></li>
								<li><a href="gallery.html" class="active">Gallery</a></li>
								<li><a href="#" class="dropdown-toggle" data-toggle="dropdown" role="button" aria-haspopup="true" aria-expanded="false">Pages <span class="caret"></span></a>
									<ul class="dropdown-menu">
										<li><a href="icons.html">Web Icons</a></li>
										<li><a href="codes.html">Short Codes</a></li>
									</ul>
								</li>
								<li><a href="contact.html">Mail Us</a></li>
							</ul>
						</div>
					</nav>
				</div>
				<div class="cd-main-header">
					<ul class="cd-header-buttons">
						<li><a class="cd-search-trigger" href="#cd-search"> <span></span></a></li>
					</ul>
					<!-- cd-header-buttons -->
				</div>
				<div id="cd-search" class="cd-search">
					<form action="#" method="post">
						<input name="Search" type="search" placeholder="Click enter after typing...">
					</form>
				</div>
			</div>
			<!--//header-->
	</div>
	</div>
	<!-- //banner -->	
<!-- gallery -->
	<section class="agileits-gallery" id="gallery">
		<h3 class="w3l-titles">Our Gallery</h3>
		<div id="thumbGrid" data-thumbgrid="true" data-effect="scaleIn" data-delay="60" data-timing="800" data-pagination="6" data-galleryeffectnext="scaleIn"
		    data-galleryeffectprev="scaleOut">
			<img src="images/g1.jpg" alt="img01" data-highres="images/g1.jpg" data-caption="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
			/>
			<img src="images/g2.jpg" alt="img02" data-highres="images/g2.jpg" data-caption="Nullam quis risus eget urna mollis ornare vel eu leo."
			/>
			<img src="images/g3.jpg" alt="img03" data-highres="images/g3.jpg" data-caption="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus."
			/>
			<img src="images/g4.jpg" alt="img04" data-highres="images/g4.jpg" data-caption="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
			/>
			<img src="images/g5.jpg" alt="img05" data-highres="images/g5.jpg" data-caption="Nullam quis risus eget urna mollis ornare vel eu leo."
			/>
			<img src="images/g6.jpg" alt="img06" data-highres="images/g6.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g7.jpg" alt="img07" data-highres="images/g7.jpg" data-caption="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus."
			/>
			<img src="images/g1.jpg" alt="img08" data-highres="images/g1.jpg" data-caption="Cras mattis consectetur purus sit amet fermentum."
			/>
			<img src="images/g2.jpg" alt="img09" data-highres="images/g2.jpg" data-caption="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
			/>
			<img src="images/g3.jpg" alt="img10" data-highres="images/g3.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g4.jpg" alt="img11" data-highres="images/g4.jpg" data-caption="Nullam quis risus eget urna mollis ornare vel eu leo."
			/>
			<img src="images/g5.jpg" alt="img12" data-highres="images/g5.jpg" data-caption="Cras mattis consectetur purus sit amet fermentum."
			/>
			<img src="images/g6.jpg" alt="img13" data-highres="images/g6.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g7.jpg" alt="img14" data-highres="images/g7.jpg" data-caption="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
			/>
			<img src="images/g1.jpg" alt="img15" data-highres="images/g1.jpg" data-caption="Nullam quis risus eget urna mollis ornare vel eu leo."
			/>
			<img src="images/g2.jpg" alt="img16" data-highres="images/g2.jpg" data-caption="Cras mattis consectetur purus sit amet fermentum."
			/>
			<img src="images/g3.jpg" alt="img17" data-highres="images/g3.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g4.jpg" alt="img18" data-highres="images/g4.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g5.jpg" alt="img19" data-highres="images/g5.jpg" data-caption="Lorem ipsum dolor sit amet, consectetur adipiscing elit."
			/>
			<img src="images/g6.jpg" alt="img20" data-highres="images/g6.jpg" data-caption="Cras mattis consectetur purus sit amet fermentum."
			/>
			<img src="images/g7.jpg" alt="img21" data-highres="images/g7.jpg" data-caption="Duis mollis, est non commodo luctus, nisi erat porttitor ligula, eget lacinia odio sem nec elit."
			/>
			<img src="images/g1.jpg" alt="img22" data-highres="images/g1.jpg" data-caption="Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus."
			/>
		</div>
	</section>
	<!-- //gallery -->
	
<!-- footer -->
<div class="footer">
		<div class="container">
			<div class="col-md-5 footer-grids">
				<h3>Subscribe</h3>
				<p>Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium.</p>
				<form action="#" method="post">
					<input type="email" name="email" placeholder="Enter your email" required="">
					<input type="submit" value="">
				</form> 
			</div>
			<div class="col-md-4 footer-grids">
				<h3>Review</h3>
				<p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sheets containing lorem lpsum passages sed do consectetur adipisicing elit.</p>
			</div> 
			<div class="col-md-3 footer-grids"> 
				<h3>Contact Me</h3>
				<p>123 T. Globel Place.<br>
				<span>Office: 908-0000</span>
				<span>Support to: <a href="mailto:info@example.com">mail@example.com</a></span>
				</p>
			</div>
			<div class="clearfix"> </div> 
		</div>
	</div>
	<!-- footer -->
	<div class="copyright">
		<div class="container">
			<p>Copyright &copy; 2018.Company name All rights reserved.More Templates <a href="http://www.baisheng999.com/" target="_blank" title="网站模板库">网站模板库</a> - Collect from <a href="http://www.baisheng999.com/" title="网页模板" target="_blank">网页模板</a></p>
			<ul class="social-icons3">
				<li><a href="#" class="fa fa-facebook icon-border facebook"> </a></li>
				<li><a href="#" class="fa fa-twitter icon-border twitter"> </a></li>
				<li><a href="#" class="fa fa-google-plus icon-border googleplus"> </a></li>
				<li><a href="#" class="fa fa-rss icon-border rss"> </a></li>
			</ul>
		</div>
	</div>
	<!-- //footer -->
<!-- bootstrap-pop-up -->
					<div class="modal video-modal fade" id="myModal1" tabindex="-1" role="dialog" aria-labelledby="myModal">
						<div class="modal-dialog" role="document">
							<div class="modal-content">
								<div class="modal-header">
										Improve
									<button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>	
								</div>
								<section>
									<div class="modal-body">
										<img src="images/g3.jpg" alt=" " class="img-responsive" />
										<p>It is a long established fact that a reader will be distracted by the readable content of a page when looking at its layout. The point of using Lorem Ipsum is that it has a more-or-less normal distribution of letters, as opposed to using 'Content here, content here', making it look like readable English.</p>
									</div>
								</section>
							</div>
						</div>
					</div>
					<!-- //bootstrap-pop-up -->
	<!-- js-scripts -->
	<!-- js -->
	<script type="text/javascript" src="js/jquery-2.1.4.min.js"></script>
	<script type="text/javascript" src="js/bootstrap.js"></script>
	<!-- Necessary-JavaScript-File-For-Bootstrap -->
	<!-- //js -->
	<!-- smooth scrolling -->
	<script type="text/javascript" src="js/move-top.js"></script>
	<script type="text/javascript" src="js/easing.js"></script>
	<!-- here stars scrolling icon -->
	<script type="text/javascript">
		$(document).ready(function() {
			/*
				var defaults = {
				containerID: 'toTop', // fading element id
				containerHoverID: 'toTopHover', // fading element hover id
				scrollSpeed: 1200,
				easingType: 'linear' 
				};
			*/
								
			$().UItoTop({ easingType: 'easeOutQuart' });
								
			});
	</script>
	<!-- //here ends scrolling icon -->
<!-- //smooth scrolling -->
<!-- scrolling script -->
<script type="text/javascript">
	jQuery(document).ready(function($) {
		$(".scroll").click(function(event){		
			event.preventDefault();
			$('html,body').animate({scrollTop:$(this.hash).offset().top},1000);
		});
	});
</script> 
<!-- //scrolling script -->
	<!--search jQuery-->
	<script src="js/main.js"></script>
	<!--//search jQuery-->
	<!-- smooth scrolling -->
	<script src="js/SmoothScroll.min.js"></script>
	<!-- //smooth scrolling -->
	<!-- js-scripts -->
	<!-- js files for gallery section -->
	<script src="js/jquery.mb.CSSAnimate.min.js"></script>
	<script src="js/jquery.mb.thumbGrid.js"></script>
	<script>
		jQuery(function () {
			jQuery("[data-thumbgrid]").thumbGrid();

			//    customize
			jQuery("#effect").on("change", function () {
				var x = $(this).val();
				jQuery("#thumbGrid").data("effect", x);
			});

			jQuery("#delay").on("change", function () {
				var x = parseFloat($(this).val());
				jQuery("#thumbGrid").data("delay", x);
			});

			jQuery("#timing").on("change", function () {
				var x = parseFloat($(this).val());
				jQuery("#thumbGrid").data("timing", x);
			});
		});
	</script>
	<!-- //js files for gallery section -->


</body>

</html>